<!DOCTYPE html>
<html lang="zh-cmn-Hans"
      xmlns:th="http://www.thymeleaf.org"
      xmlns:sec="http://www.thymeleaf.org/thymeleaf-extras-springsecurity5">
<head th:include="sb-admin/base :: head(~{::title},~{},~{})">
    <title>SB Admin 2 - Role</title>
</head>

<body id="page-top">

<!-- Page Wrapper -->
<div id="wrapper">

    <!-- Sidebar -->
    <div th:replace="sb-admin/index :: menus"></div>
    <!-- End of Sidebar -->

    <!-- Content Wrapper -->
    <div id="content-wrapper" class="d-flex flex-column">

        <!-- Main Content -->
        <div id="content">

            <!-- Topbar -->
            <div th:replace="sb-admin/index :: topbar"></div>
            <!-- End of Topbar -->

            <!-- Begin Page Content -->
            <div class="container-fluid">

                <!-- Page Heading -->
                <h1 class="h3 mb-4 text-gray-800">角色</h1>

                <div class="card shadow mb-4">
                    <div class="card-header py-3">
                        <h6 class="m-0 font-weight-bold text-primary">角色列表</h6>
                    </div>
                    <div class="card-body">
                        <div class="table-responsive">

                            <!-- table toolbar -->
                            <div class="btn-toolbar" role="toolbar" aria-label="Toolbar with button groups"
                                 id="toolbar">
                                <div class="btn-group mr-2" role="group" aria-label="First group">
                                    <button type="button" class="btn btn-secondary" onClick="doCreate(this)">
                                        <i class="fas fa-fw fa-plus"></i>新建
                                    </button>
                                    <button type="button" class="btn btn-secondary" onClick="doEdit(this)">
                                        <i class="fas fa-fw fa-edit"></i>编辑
                                    </button>
                                    <button type="button" class="btn btn-secondary" onClick="doDelete(this)">
                                        <i class="fas fa-fw fa-trash"></i>删除
                                    </button>
                                </div>
                            </div>

                            <!-- table -->
                            <table class="table table-hover table-striped" id="dataTable"
                                   data-toggle="table"
                                   data-show-toggle="true"
                                   data-multiple-select-row="true"
                                   data-click-to-select="true"
                                   data-show-button-icons="true"
                                   data-show-refresh="true"
                                   data-show-pagination-switch="true"
                                   data-pagination="true"
                                   data-search="true"
                                   data-show-search-button="true"
                                   data-show-search-clear-button="true"
                                   data-sortable="true"
                                   data-show-columns="true"
                                   data-show-fullscreen="true"
                                   data-url="/role/findRoleList"
                                   data-toolbar="#toolbar">
                                <thead class="thead-dark">
                                <tr>
                                    <th data-field="state" data-checkbox="true"></th>
                                    <th data-field="id" data-title="id" data-visible="false"></th>
                                    <th data-field="name" data-title="角色代码"></th>
                                    <th data-field="desc" data-title="角色名称">Position</th>
                                    <th data-field="createTime" data-title="创建时间">Position</th>
                                    <th data-field="createBy" data-title="创建人">Position</th>
                                    <th data-field="modifiedTime" data-title="修改时间">Position</th>
                                    <th data-field="modifiedBy" data-title="修改人">Position</th>
                                </tr>
                                </thead>
                            </table>

                            <!-- Role Modal -->
                            <div class="modal fade" id="roleModal" tabindex="-1" role="dialog"
                                 aria-labelledby="roleModalLabel" aria-hidden="true">
                                <div class="modal-dialog" role="document">
                                    <div class="modal-content">
                                        <div class="modal-header">
                                            <h5 class="modal-title" id="roleModalLabel">角色信息</h5>
                                            <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                                                <span aria-hidden="true">&times;</span>
                                            </button>
                                        </div>
                                        <div class="modal-body">
                                            <form id="roleForm" th:action="@{/role/save}" method ="post">
                                                <input type="hidden" id="id" name="id">
                                                <div class="form-group row">
                                                    <label for="name"
                                                           class="col-sm-2 col-form-label">角色代码</label>
                                                    <div class="col-sm-10">
                                                        <input type="text" class="form-control" id="name" name="name">
                                                    </div>
                                                </div>
                                                <div class="form-group row">
                                                    <label for="desc"
                                                           class="col-sm-2 col-form-label">角色名称</label>
                                                    <div class="col-sm-10">
                                                        <input type="text" class="form-control" id="desc" name="desc">
                                                    </div>
                                                </div>
                                            </form>
                                        </div>
                                        <div class="modal-footer">
                                            <button type="button" class="btn btn-secondary" data-dismiss="modal">关闭
                                            </button>
                                            <button type="button" class="btn btn-primary" onClick="doSave(this)">保存
                                            </button>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>

            </div>
            <!-- /.container-fluid -->

        </div>
        <!-- End of Main Content -->

        <!-- Footer -->
        <div th:replace="sb-admin/index :: footer"></div>
        <!-- End of Footer -->

    </div>
    <!-- End of Content Wrapper -->

</div>
<!-- End of Page Wrapper -->

<!-- Scroll to Top Button-->
<a class="scroll-to-top rounded" href="#page-top">
    <i class="fas fa-angle-up"></i>
</a>
<!-- Logout Modal -->
<div th:replace="sb-admin/index :: logout"></div>
<!-- commonJS -->
<div th:replace="sb-admin/base :: commonJS"></div>

<script src="/js/role.js"
        th:src="@{/js/role.js}"></script>
</body>
</html>
